<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>

</body>
<script>
    // 数组下面有哪些方法
    {
        // length
        // const arr = [1,2,3,4,100];
        // console.log(arr.length);// 5
    }
    {
        // 遍历
        // const arr = [1,2,3,4,100];
        // for
        // for(let i=0;i<arr.length;i++){
        //     console.log(arr[i])
        // }

        // for in
        // for(let suibian in arr){
        //     console.log(arr[suibian])
        // }

        // forEach,传递一个函数（回调函数）
        // 回调函数接收三个参数：第一个参数是元素的值，第二个参数是元素的下标，第三个参数是数组自身
        // arr.forEach(function(v,i,a){
        //     console.log(v,i,a===arr)
        // })

        // 查找:includes返回的是一个布尔值，如果包含true,不包含为false
        // console.log(arr.includes(100));// true
        // console.log(arr.includes(1000));// false
    }
    {
        // find:可以查找满足条件的元素，如果条件都不满足得到的是undefined
        // const arr = [{a:1},{a:2},{a:3}];
        // console.log(arr.includes({a:1}));// false
        // find接收的是一个回调函数，回调函数接收三个参数：第一个参数是元素的值，第二个参数是元素的下标，第三个参数是数组自身
        // 如果回调函数返回的是true,停止遍历。
        // 当回调函数返回的是true,那么find返回的是v
        // 如果没有满足的条件，那么find返回的是undefined
        // const item =  arr.find(function(v,i,a){
        //     console.log(v);
        //     return v.a === 20;// 查找元素属性a的值为2的属性
        // });
        // console.log(item);

        // findIndex:可以查找满足条件的元素所在的下标，如果条件都不满足得到的是-1
        // const index = arr.findIndex(function(v){
        //     return v.a === 20;
        // })
        // console.log(index)
    }
    {
        // map作用是映射出来一个新的数组
        // 新的数组的特点：
        // 1- 映射出来的数组arr2与arr数组的长度相同
        // 2- 回调函数每次执行后的返回值会作为映射出来的数组arr2的元素值
        // const arr = [1,2,3,4];
        // const arr2 = arr.map(function(v){
        //     return v+100;
        // });
        // console.log(arr2);// [101,102,103,104]
    }
    {
        // join
        // const arr = [{name:"古天乐"},{name:"古巨基"},{name:"古力娜扎"}];

        // 古天乐 古巨基 古力娜扎
        // 1- 将数组映射为["古天乐","古巨基","古力娜扎"]
        // const arr2 = arr.map(function(v){
        //     return v.name;
        // })
        // console.log(arr2);// ["古天乐","古巨基","古力娜扎"]
        // // 2- join转为字符串
        // console.log(arr2.join(" "));// 古天乐 古巨基 古力娜扎



        // const arr2 = arr.map(function(v){
        //     return v.name;
        // }).join(" ");
        //
        // console.log(arr2)// 古天乐 古巨基 古力娜扎


        // const arr2 = [1,2,3,4];
        // // 可以将数组的元素拼接为字符串
        // console.log(arr2.join());// 1,2,3,4
        // console.log(arr2.join(" "));// 1 2 3 4
        // console.log(arr2.join("、"));// 1、2、3、4

    }
    {
        const arr = [{name:"古天乐"},{name:"古巨基"},{name:"古力娜扎"}];
        // 目标将数组转为字符串：古天乐  古巨基  古力娜扎
        // console.log(["古天乐","古巨基","古力娜扎"].join(" "));// 古天乐 古巨基 古力娜扎

        // ["古天乐","古巨基","古力娜扎"]
        // const arr2 = arr.map(function(v){
        //     return v.name;
        // }).join(" ")
        // console.log(arr2);

        // 箭头函数
        const arr2 = arr.map(v=>v.name).join(" ")
        console.log(arr2);
    }
</script>
</html>